require(["./config"], () => {
    require(["jquery"], ($) => {
        class Register{
            constructor() {
                this.note = "";
                this.flagTel = false;
                this.flagNote = false;
                this.flagPwd = false;
                this.flagPwdR = false;
                this.flagPwdAll = false;
                this.flagAgree = false;
                this.registerBtnReady = false;
                this.init();
            }
            init() {
                const _this = this;
                // 所有表单获取/失去焦点时，提示文字及焦点颜色
                $(".formBox")
                .on("focus", "input", function () {
                    $(this).parent().addClass("focusInput").removeClass("warningInput").removeClass("warningIInput").removeClass("warningRInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "none")
                    }
                })
                .on("blur", "input", function () {
                    $(this).parent().removeClass("focusInput")
                    if ($(this).val() === "") {
                        $(this).next().css("display", "block")
                    }
                })
                // 表单提示文字消失/出现事件
                // 提示文字没有使用placeholder，导致额外设置此事件
                // 设置placeholder又涉及单独修改placeholder样式，样式本身兼容性不好
                // $(".placeholderMsg")
                // .click(function () {
                //     $(this).css("display", "none")
                //     .parent().find("input").focus();
                // })


                // 电话号表单验证事件
                $(".telInput")
                .on("input focus", function () {
                    _this.flagTel = false;
                    $(this).parent().addClass("focusInput").removeClass("warningInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "none")
                    } else {
                        const reg = /^1\d{10}$/;
                        if ($(this).val() && reg.test($(this).val())) {
                            _this.flagTel = true;
                            $(".noteBtn").addClass("ready");
                        } else {
                            $(".noteBtn").removeClass("ready");
                        }
                    }
                })
                .on("change blur", function () {
                    $(this).parent().removeClass("focusInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "block")
                    } else {
                        if (!_this.flagTel) {
                            $(this).parent().addClass("warningInput");
                        }
                    }
                })


                // 短信表单点击按钮
                $(".noteBtn").click(function () {
                    if (_this.flagTel) {
                        _this.note = "";
                        for (let i = 0; i < 6; i++) {
                            _this.note += Math.floor(Math.random() * 10)
                        }
                        $(this)
                        .parent().find(".noteContent").css("display", "block")
                        .find(".note").text(_this.note);
                    }
                })
                // 短信表单验证事件
                $(".noteInput")
                .on("input focus", function () {
                    _this.flagNote = false;
                    $(this).parent().removeClass("warningInput").removeClass("warningIInput").addClass("focusInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "none")
                    } else {
                        const reg = /^\d{6}$/;
                        if ($(this).val() && reg.test($(this).val())) {
                            _this.flagNote = true;
                        }
                    }
                })
                .on("change blur", function () {
                    $(this).parent().removeClass("focusInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "block")
                    } else {
                        if (!_this.flagNote) {
                            $(this).parent().addClass("warningInput");
                        }
                    }
                })

                // 密码表单验证事件
                $(".pwdInput")
                .on("input focus", function () {
                    _this.flagPwdAll = false;
                    _this.flagPwd = false;
                    $(this).parent().removeClass("warningInput").addClass("focusInput");
                    $(".pwdRInput").parent().removeClass("warningInput").removeClass("warningRInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "none")
                    } else {
                        const reg = /^.{6,16}$/;
                        if ($(this).val() && reg.test($(this).val())) {
                            _this.flagPwd = true;
                        }
                        if (_this.flagPwd && _this.flagPwdR && $(this).val() === $(".pwdRInput").val()) {
                            _this.flagPwdAll = true;
                        }
                    }
                })
                .on("change blur", function () {
                    $(this).parent().removeClass("focusInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "block")
                    } else {
                        if (!_this.flagPwd) {
                            $(this).parent().addClass("warningInput");
                        } else if (!_this.flagPwdAll) {
                            $(".pwdRInput").parent().addClass("warningRInput");
                        }
                    }
                })
                // 重复密码框验证事件
                $(".pwdRInput")
                .on("input focus", function () {
                    _this.flagPwdAll = false;
                    _this.flagPwdR = false;
                    $(this).parent().removeClass("warningInput").removeClass("warningRInput").addClass("focusInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "none")
                    } else {
                        const reg = /^.{6,16}$/;
                        if ($(this).val() && reg.test($(this).val())) {
                            _this.flagPwdR = true;
                        }
                        if (_this.flagPwd && _this.flagPwdR && $(this).val() === $(".pwdInput").val()) {
                            _this.flagPwdAll = true;
                        }
                    }
                })
                .change(function () {
                    $(this).parent().removeClass("focusInput");
                    if ($(this).val() === "") {
                        $(this).next().css("display", "block")
                    } else {
                        if (!_this.flagPwdR) {
                            $(this).parent().addClass("warningInput")
                        } else if (!_this.flagPwdAll) {
                            $(this).parent().addClass("warningRInput");
                        }
                    }
                })

                // 同意条款事件
                $(".agreeBtn").click(function () {
                    if (_this.flagAgree) {
                        $(this).css("backgroundPosition", "-1px -20px");
                        _this.flagAgree = false;
                    } else {
                        $(this).css("backgroundPosition", "-1px 0");
                        _this.flagAgree = true;
                    }
                })

                // 提交按钮出现事件
                $("input")
                .on("input", function () {
                    // console.log(_this.flagTel, _this.flagNote, _this.flagPwdR, _this.flagAgree)
                    if (_this.flagTel && _this.flagNote && _this.flagPwdAll) {
                        $(".registerBtn").addClass("ready")
                        _this.registerBtnReady = true;
                        
                    } else {
                        $(".registerBtn").removeClass("ready");
                        _this.registerBtnReady = false;
                    }
                })

                // 提交事件
                $(".registerBtn")
                .click(function () {
                    // console.log(_this.note, $(".noteInput").val())
                    if (_this.registerBtnReady) {
                        if (!_this.flagAgree){
                            $(".agreeBox")
                            .animate({"left": "-20px"}, 50, function() {
                                $(this).animate({"left": "20px"}, 50, function () {
                                    $(this).animate({"left": "0"}, 50)
                                })
                            })
                        } else if ($(".noteInput").val() !== _this.note) {
                            $(".noteForm").addClass("warningIInput")
                        } else{
                            _this.register();
                        }
                    }
                })



            }
            // 注册函数
            register() {
                let userTel = $(".telInput").val();
                let userPwd = $(".pwdInput").val();
                let flag = true;
                let data = null;
                if (localStorage.getItem("userData")) {
                    data = JSON.parse(localStorage.getItem("userData"));
                    for (let index in data.userList) {
                        if (userTel === data.userList[index].userTel) {
                            flag = false;
                            $(".resultBox p")
                                .text("用户名已存在")
                                .next()
                                .text("重新输入>>")
                                .attr("href", "/html/register.html")
                                .parent()
                                .fadeIn(1000, function () {})
                            break;
                        }
                    }
                    if (flag === true) {
                        data.userList.push({
                            "userTel" : userTel,
                            "userPwd" : userPwd
                        });
                    }
                } else{
                    flag = true;
                    data = {
                        "userList" : [{
                            "userTel" : userTel,
                            "userPwd" : userPwd
                        }]
                    }
                }
                if (flag) {
                    $(".resultBox p")
                        .text("注册成功！")
                        .next()
                        .text("去登录>>")
                        .attr("href", "/html/login.html")
                        .parent()
                        .fadeIn(1000, function () {})
                    localStorage.setItem("userData", JSON.stringify(data));
                }
            }
        }
        new Register();
    })
})